<template>
    <div v-bind:class="['com-button',type]" v-on:click="onClick">
        <slot/>
    </div>
</template>

<script>
export default {
  name: "comButton",
  props: {
    type: {
      type: String,
      required: false
    }
  },
  methods: {
    onClick(e) {
      console.log("=============");
      this.$emit("click1", e);
    }
  }
};
</script>


<style scoped lang="scss">
.com-button {
  width: 80px;
  height: 40px;
  line-height: 40px;
  background: #2d8cf0;
  border-radius: 10px;
  color: #fff;
  cursor: pointer;
  font-size: 16px;
  &:hover {
    background: #57a3f3;
  }
  &:active {
    background: #2b85e4;
  }
}

.error {
  background: red;
  &:hover {
    background: #57a3f3;
  }
  &:active {
    background: #2b85e4;
  }
}
</style>